<template>
  <div class="container">
    <el-form :model="formData" :disabled="projectParams.switch" ref="form" label-position="top" :rules="rules"
             :inline="false" size="normal"
    >
      <el-row :gutter="20">
        <el-col :span="8" :offset="0">
          <el-form-item label="报修联系人" prop="repairs_person">
            <el-input v-model="formData.repairs_person" placeholder="报修联系人"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8" :offset="0">
          <el-form-item label="报修联系人电话" prop="repairs_person_phone">
            <el-input v-model="formData.repairs_person_phone" placeholder="报修联系人电话"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8" :offset="0">
          <el-form-item label="申报单位" prop="apply_company_code">
            <el-input v-model="formData.apply_company_code" disabled placeholder="申报单位"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8" :offset="0">
          <el-form-item label="关联资产" prop="device_id">
            <el-input v-model="formData.device_id" placeholder="关联资产"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8" :offset="0">
          <el-form-item label="审核状态" prop="status">
            <el-select v-model="formData.status" disabled value-key="project_model" placeholder="请选择" class="wid">
              <el-option v-for="item in status_list" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8" :offset="0">
          <el-form-item label="工单计划完成时间" prop="plan_complete_date">
            <el-date-picker v-model="formData.plan_complete_date" type="date" value-format="yyyy-MM-dd"
                            placeholder="工单计划完成时间"
                            :clearable="false" class="wid"
            >
            </el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20" v-for="(item,index) in formData.word_order_content_list" :key="index">
        <el-col :span="16" :offset="0">
          <el-form-item label="工单内容" prop="word_order_content">
            <el-input v-model="item.content" placeholder="工单内容"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8" :offset="0">
          <el-form-item label="1" class="node">
            <el-button type="success" @click="addContent" icon="el-icon-plus" circle></el-button>
            <el-button type="danger" @click="subContent(index)" v-if="index!=0" icon="el-icon-minus" circle></el-button>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="24" :offset="0">
          <el-form-item label="备注">
            <el-input v-model="formData.remarks" placeholder="备注" size="normal" clearable type="textarea"
                      :rows="4"
            >
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div class="center">
      <el-button type="danger" @click="projectCancel">取消</el-button>
      <template v-if="this.switch && this.copyStatus!='0'">
        <el-button type="primary" @click="projectEdit" :loading="saveLoading" v-if="projectParams.pid">修改</el-button>
        <el-button type="primary" @click="projectAdd" :loading="saveLoading" v-else>添加</el-button>
      </template>
    </div>
  </div>
</template>
<script>
import UpLoad from '../Upload'
import { d_buildType, d_purchaseType, d_levelProtect, d_declareType, d_declarePastType } from '@/utils/dicts.js'

export default {
  name: 'Project',
  components: {
    UpLoad
  },
  props: {
    projectParams: {
      type: Object,
      default: () => {
        return {}
      }
    },
    switch: {
      type: Boolean,
      default: () => {
        return false
      }
    },
    copyStatus: {
      type: String,
      default: () => {
        return '3'
      }
    }
  },
  data() {
    return {
      status_list: [{ label: '需求单位填报', value: '0' }, {
        label: '保障部（初审）',
        value: '1'
      }, { label: '运维技术部（审核）', value: '2' }, {
        label: '运维总集（联通）上传完成情况',
        value: '3'
      }, { label: '需求单位确认', value: '4' }],
      saveLoading: false,
      formData: {
        check_flag: '0',
        status: '0',
        word_order_content_list: [],
        apply_company_code: this.$store.getters.user.company_name
      },
      rules: {
        repairs_person: [
          { required: true, message: '请输入报修联系人', trigger: 'blur' }
        ],
        repairs_person_phone: [
          { required: true, message: '请输入报修联系人电话', trigger: 'blur' }
        ],
        amount: [
          { required: true, validator: this.$util.isFloat, trigger: 'blur' }
        ],
        plan_complete_date: [
          { required: true, message: '请选择完成时间', trigger: 'change' }
        ],
        word_order_content: [
          { required: true, message: '请输入工单内容', trigger: 'blur' }
        ]

      },
      d_buildType: d_buildType,
      d_purchaseType: d_purchaseType,
      d_levelProtect: d_levelProtect,
      d_declareType: d_declareType,
      d_declarePastType: d_declarePastType,
      dsjShow: false,
      fgwShow: false
    }
  },
  created() {

  },
  mounted() {
    if (this.projectParams.pid) {
      this.init()
    } else {
      this.getWList()
    }
  },
  methods: {
    addContent() {
      this.formData.word_order_content_list.push({ content: '' })
    },
    subContent(index) {
      this.formData.word_order_content_list.splice(index, 1)
    },
    getWList() {
      if (this.formData.word_order_content) {
        let arr = this.formData.word_order_content.split('&&**%@!')
        this.formData.word_order_content_list = []
        for (const arrKey in arr) {
          if (arr[arrKey]) {
            this.formData.word_order_content_list.push({ content: arr[arrKey] })
          }
        }
      } else {
        this.formData.word_order_content_list = [{ content: '' }]
      }
    },
    setWList() {
      if (this.formData.word_order_content_list) {
        this.formData.word_order_content = ''
        for (const argumentsKey in this.formData.word_order_content_list) {
          this.formData.word_order_content += this.formData.word_order_content_list[argumentsKey].content + '&&**%@!'
        }
        return true
      } else {
        this.$tips.error('未填写工单内容')
        return false
      }
    },
    async init() {
      this.saveLoading = true
      this.formData = this.projectParams.row
      this.formData.plan_complete_date = this.$util.formatDate(this.formData.plan_complete_date, 'yyyy-MM-dd')
      this.getWList()
      this.saveLoading = false
    },
    projectCancel() {
      this.$emit('cancel')
    },
    async projectEdit() {
      let content = this.setWList()
      if (!content) {
        return false
      }
      this.saveLoading = true
      await this.$refs['form'].validate(async(valid) => {
        if (valid) {

          const res = await this.$http('infoWorkOrderServiceupdateApplyData', {
            ...this.formData
          })
          if (res.errcode === 4000) {
            this.$tips.declareUp(res.errmsg)
          } else if (res.errcode === 9999) {
            this.$tips.error(res.errmsg)
          } else {
            this.$tips.success(res.errmsg)
          }
          this.saveLoading = false
          this.$emit('cancel')
          this.$emit('init')
        } else {
          this.$tips.error('请检查必填项')
          this.saveLoading = false
          return false
        }
      })
    },
    async projectAdd() {
      let content = this.setWList()
      if (!content) {
        return false
      }
      this.saveLoading = true
      await this.$refs['form'].validate(async(valid) => {
        if (valid) {

          const res = await this.$http('infoWorkOrderServiceaddData', {
            ...this.formData
          })
          this.$tips.success(res.errmsg)
          this.saveLoading = false
          this.$emit('cancel')
          this.$emit('init')
        } else {
          this.$tips.error('请检查必填项')
          this.saveLoading = false
          return false
        }
      })
    }
  },
  computed: {},
  watch: {}
}
</script>
<style lang="scss" scoped>
::v-deep .node .el-form-item__label {
  color: transparent;
}
</style>
